<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <link href="js/lib/css/bootstrap.min.css" rel="stylesheet">
    <link href="css/index.css" rel="stylesheet" type="text/css">
</head>
<body>
<!--顶端导航-->
<div class="top">
    <div class="nav">
        <ul class="city">
            <li class="green">辽源</li>
            <li id="change">【切换城市】</li>
            <li>|</li>
            <li>同城帮首页</li>
        </ul>
        <ul class="login">
            <li><a href="#" class="loginIn">登录</a></li>
            <li><a href="#" class="enrollIn">注册</a></li>
            <li><a href="#">我的订单</a></li>
            <li><a href="#">在线客服（9：:0-21:00）</a></li>
            <li>客户服务</li>
            <li><a href="#">论坛</a></li>
            <li style="margin-right: 0px;border: none"><a href="#" style="color: #FF0000">投诉建议</a></li>
        </ul>
    </div>
</div>
<!--登陆页面-->
<div class="loginDiv">
   <div class="deng">
       <p class="welcome"><img src="images/deng.png"><span>欢迎登陆360同城帮</span><span class="x">×</span></p>
       <p class="num">账&nbsp;&nbsp;&nbsp;号：<input type="text" name="username"></p>
       <p class="pass">密&nbsp;&nbsp;&nbsp;码：<input type="text" name="pwd"></p>
       <p class="check"><input type="checkbox"> <span>下次自动登陆</span></p>
       <input type="submit" value="立即登陆" class="go">
       <p class="other"><span>其他账号登陆:&nbsp;&nbsp;</span><img src="images/dengtu.png"></p>
       <hr width="100%" style="margin-top:5px" >
       <p class="last"><span><a href="#" class="b">注册新账号</a></span>&nbsp;&nbsp;&nbsp;|&nbsp;&nbsp;&nbsp;<span><a href="#">忘记密码？</a></span></p>
   </div>
</div>
<!--注册页面-->
<div class="enroll">
    <div class="enrollDiv">
        <p class="welcome1"><img src="images/deng.png"><span>欢迎登陆360同城帮</span><span class="x1">×</span></p>
        <div class="zuo">
            <p class="shouji">手机注册</p>
            <p class="youxiang">邮箱注册</p>
        </div>
        <div class="you1">
            <p class="sj">手机号：<input type="text"></p>
            <p class="text"><span>请输入您的手机号</span></p>
            <p class="yz">验证码：<input type="text"></p>
            <p class="text"><span>请输入图片中的字母或数字，不区分大小写</span></p>
            <p class="jy">校验码：<input type="text"></p>
            <p class="text"><span>请输入短信中6位数字校验码</span></p>
            <p>密&nbsp;&nbsp;&nbsp;码：<input type="text"></p>
            <p class="text"><span>6-20个字符（区分大小写）</span></p>
            <input type="submit" value="马上注册" class="zhu">
            <p class="text"><input type="checkbox" style="width: 15px;height: 15px;margin-left: 50px" checked="checked"> <span style="margin-left: 5px">我已阅读并同意<font color="blue">《360用户服务条款》</font></span></p>
        </div>
    </div>
</div>
<div class="wrap0">
    <div class="wrap">
        <div class="logo">
            <img src="images/35.png">
            <ul class="right">
                <li>优品</li>
                <li>手机回收</li>
                <li>手机维修</li>
                <li>电脑维修</li>
                <li>依旧换新</li>
                <li>手机租用</li>
            </ul>
            <!--<img src="">-->
        </div>
        <!--轮播图部分-->
        <div id="mycarousel" class="carousel slide" data-ride="carousel" data-interval="2000">
            <ol class="carousel-indicators">
                <li data-target="#mycarousel" data-slide-to="0" class="active"></li>
                <li data-target="#mycarousel" data-slide-to="1"></li>
                <li data-target="#mycarousel" data-slide-to="2"></li>
            </ol>
            <div class="carousel-inner">
                <div class="item active" >
                    <img src="images/6.png">
                </div>
                <div class="item" >
                    <img src="images/6.png">
                </div>
                <div class="item" >
                    <img src="images/6.png">
                </div>
            </div>
        </div>
        <div class="wrap0">
            <div class="wrap">
                <div class="mengDiv">
                    <ul class="opacityU">
                        <li><img src="images/2_03.png"><span>修手机/Pad</span><span class="you"> > </span> </li>
                        <li><img src="images/2_06.png"><span>修电脑</span><span class="you"> > </span> </li>
                        <li><img src="images/2_08.png"><span>卖手机/电脑</span><span class="you"> > </span> </li>
                        <li><img src="images/2_10.png"><span>买二手机</span></li>
                    </ul>
                </div>
            </div>
        </div>
    </div>
</div>
<!--四张图片，旧手机-->
<div class="bad">
    <img src="images/2.jpg">
    <img src="images/10.jpg">
    <img src="images/15.png">
    <img src="images/14.jpg" style="border-right:none">
</div>
<!--热门手机回收部分-->
<div class="recycle">
    <p>热门手机回收</p>
    <img src="images/1_03.png">
    <span>查看更多&nbsp;&nbsp;</span>
</div>
<div class="hotRecycle">
    <img src="images/4_03.png">
    <img src="images/4_01.png">
    <img src="images/4_04.png">
    <img src="images/4_05.png">
    <img src="images/4_02.png">
    <img src="images/4_07.png">
</div>
<!--优品精选部分-->
<div class="recycle">
    <p style="color: #666666">优品精选</p>
    <img src="images/1_03.png">
    <span style="color: #666666">查看更多&nbsp;&nbsp;</span>
</div>
<div class="hotRecycle">
    <img src="images/4_06.png">
    <img src="images/4_10.png">
    <img src="images/4_04.png">
    <img src="images/4_02.png">
    <img src="images/4_07.png">
    <img src="images/4_05.png">
</div>
<div class="recycle">
    <p style="color: #666666">到店维修</p>
</div>
<div class="wrap1">
    <!--选择所在县区块-->
    <div class="wrap" style="margin-top: 10px">
        <div class="shi">
            辽源
            <div class="triangle"></div>
        </div>
        <div class="shi">
            选择区县
            <div class="triangle" style="margin-right: 40px"></div>
        </div>
        <div class="so">
            <input type="text" placeholder="&nbsp;&nbsp;&nbsp;输入您的位置查找附近的商家">
            <button>搜索</button>
        </div>
    </div>
</div>
<div class="wrap2">
    <div class="shopDiv">
        <!--排序行-->
        <div class="sort">
            <div class="sort1">默认排序</div>
            <div class="sort2">按成较量</div>
            <div class="sort2">按人气</div>
            <div class="sort2"><input type="checkbox">先行赔付</div>
            <div class="sort3">
                <div>地图模式</div>
            </div>
        </div>
        <!--商家好评榜框架-->
        <div class="good">

        </div>
        <div class="store">
        </div>
        <!--分页-->
        <div class="page">
            <div class="ye1">1</div>
            <div class="ye1">2</div>
            <div class="ye1">3</div>
            <div class="ye1" style="width: 90px">下一页</div>
        </div>
    </div>
</div>
<!--底部-->
<div class="wrap3">
    <div class="buttom">
        <ul class="one">
            <li><img src="images/38.png"><span>购物指南</span>
                <ul class="one-1">
                    <li><br><br></li>
                    <li>购物流程</li>
                    <li>购物流程</li>
                    <li>购物流程</li>
                </ul>
            </li>
        </ul>
        <ul class="one">
            <li><img src="images/38.png"><span>购物指南</span>
                <ul class="one-1">
                    <li><br><br></li>
                    <li>购物流程</li>
                    <li>购物流程</li>
                </ul>
            </li>
        </ul>
        <ul class="one">
            <li><img src="images/38.png"><span>购物指南</span>
                <ul class="one-1">
                    <li><br><br></li>
                    <li>购物流程</li>
                </ul>
            </li>
        </ul>
        <ul class="one">
            <li><img src="images/38.png"><span>购物指南</span>
                <ul class="one-1">
                    <li><br><br></li>
                    <li>购物流程</li>
                </ul>
            </li>
        </ul>
        <ul class="one">
            <li><img src="images/38.png"><span>购物指kua南</span>
                <ul class="one-1">
                    <li><br><br></li>
                    <li style="color: #4BA0F8">购物流程</li>
                    <li>购物流程</li>
                </ul>
            </li>
        </ul>
    </div>
    <div class="base">
        <p>客服电话：4000-399-360/010-53767360&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;投诉建议&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;网站地图</p>
        <p>Copyright&copy;2005-2017&nbsp;&nbsp;360.CN&nbsp;&nbsp;All&nbsp;Rights&nbsp;Reserved&nbsp;&nbsp;360安全中心</p>
        <p>京ICP备08010314号-19&nbsp;&nbsp;&nbsp;京公网安备110000000006</p>
    </div>
</div>
</body>
<script src="js/lib/js/jquery-3.2.1.min.js"></script>
<script src="js/lib/js/bootstrap.min.js"></script>
<script src="js/shop.js"></script>
<script>
    /*点击登录，出现登陆页面*/
    $(".loginIn").on("click",function () {
        $(".loginDiv").css("display","block");
    });
    /*点击关闭，登陆页面消失*/
    $(".x").on("click",function () {
        $(".loginDiv").css("display","none");
    });
    /*点击注册按钮，出现注册页面*/
    $(".enrollIn").on("click",function() {
        $(".enroll").css("display","block");
    });
    /*点击关闭*/
    $(".x1").on("click",function () {
        $(".enroll").css("display","none");
    });
    $(".shop").on("mouseover",function () {
        $(".inshop").css("display","block");
    })
</script>
</html>
</body>
</html>